<md-list-item class="container"
              [ngClass]="{
                         'priority-normal': item.priority ===3,
                         'priority-important': item.priority ===2,
                         'priority-emergency': item.priority ===1
                         }"
              (click)="onItemClick()"

>
  <md-checkbox [checked]="item.completed" class="completion-status" (click)="onClickCheckbox($event)"></md-checkbox>
  <div  md-line class="content" [ngClass]="{'completed':item.completed}">
    <span [md-tooltip]="item.desc">{{item.desc}}</span>
  </div>
  <div md-line class="bottom-bar">
        <span class="due-date" *ngIf="item.dueDate">
        	{{item.dueDate | date: "yy-MM-dd" }}
        </span>
    <md-icon *ngIf="item.reminder">alarm</md-icon>
  </div>
  <md-icon [svgIcon]="avatar" md-list-avator class="avatar"></md-icon>

</md-list-item>
